This bar chart uses the ModalDialog which in turn uses the onmodaldialog event which is added using DOM1 style methods. Click on the canvas and a ModalDialog will be shown that uses the DOM1 style onmodaldialog event to show an alert().
This goes in the documents header:<script src="RGraph.common.core.js"></script> <script src="RGraph.common.dynamic.js"></script> <script src="RGraph.modaldialog.js"></script> <script src="RGraph.bar.js"></script>Put this where you want the chart to show up:
<canvas id="cvs" width="600" height="250"> [No canvas support] </canvas>This is the code that generates the chart:
<script> window.onload = function () { var bar = new RGraph.Bar({ id: 'cvs', data: [4,8,5,3,4,6,8], options: { labels: ['Mon','Tue','Wed','Thu','Fri','Sat','Sun'], shadowOffsetx: 2, shadowOffsety: 2, shadowBlur: 2, 'background.grid.autofit.numvlines': 7, textSize:16, textAccessible: true } }).draw(); bar.onclick = function (e, shape) { ModalDialog.Show('string:<h1>A sample dialog</h1><center><a href="javascript:ModalDialog.Close()">Close</a></center>'); } bar.onmousemove = function (e, shape) { return true; } ModalDialog.onmodaldialog = function (obj) { console.log('In the onmodaldialog DOM1 style event listener'); } }; </script>